<template>
  <div style="padding-bottom : '1.333333rem'">
    <van-nav-bar fixed placeholder>
      <template #left>
        <img src="@/assets/toutiao_logo.png" alt="" class="pic" /> </template
      >>
      <template #right>
        <van-icon name="search" color="white" size="0.70rem" /> </template
      >>
    </van-nav-bar>
<!--  -->
<van-tabs v-model="active" animated sticky offset-top='1.30rem'>
  <van-tab :title="obj.name"
   v-for="obj in pindaolist"
   :name='obj.id'
  :key="obj.id"

  >
  <!-- 内容 -->
<articlelist :id='active'></articlelist>

  </van-tab>

</van-tabs>
  </div>
</template>

<script>
import articlelist from './articlelist.vue'
import { userchannel } from '@/api'
export default {

  data () {
    return {
      active: 2,
      pindaolist: []
    }
  },
  async created () {
    const res = await userchannel()
    // console.log(res)
    this.pindaolist = res.data.data.channels
  },
  components: {
    articlelist
  }
}
</script>

<style lang='less' scoped>
.pic {
  width: 120px;
}

</style>
